//充值场景

import BackGround from "../running/background"; // 引入背景文件
import { drawChineseText } from "../utils/index";
import { chargeList } from "../constant/ShopConstant";
import FixedBackground from "../utils/fixedbackground";
import Sprite from "../base/Sprite";
import RoleSelectScene from "../scene/RoleSelectScene";

//选择商店页面
export default class ShopScene {
  constructor(ctx) {
    //声明一个商店的背景
    this.ctx = ctx;
    this.bg = new BackGround(ctx);
  }

  drawBg() {
    console.log("set bg ...");
    //this.bg.paint(ctx);
    this.FixedBackground = new FixedBackground(this.ctx, 1, "clouds");
    //循环添加数据
    this.itemlist();
  }

  itemlist() {
    //绘制返回按钮
    this.img_back = Sprite.getImage("back");
    this.imgback = new Sprite(this.img_back, 30, 30, 73, 44);
    this.imgback.draw(this.ctx);


    console.info("list=" + chargeList.length);
    for (var i = 0; i < chargeList.length; i++) {
      var height = 100 + 70 * i;
      console.info("height=" + height);
      
      //写标题
      drawChineseText(chargeList[i].title,20,height,"#FFFFFF","24px Arial",this.ctx);
      //写价格
      drawChineseText(chargeList[i].price,150,height,"#FFFFFF","24px Arial",this.ctx);
      //绘制购买图标
      this.img_cart = Sprite.getImage("cart");
      this.imgcart = new Sprite(this.img_cart, 240, height-30, 40, 40);
      this.imgcart.draw(this.ctx);
    }

    this.bind(this.ctx);
  }

  bind(ctx){
    //绑定事件
    let _this = this;

    wx.onTouchStart(e => {
      let x = e.touches[0].clientX,
        y = e.touches[0].clientY;

      if (
        x >= _this.imgback.x &&
        x <= _this.imgback.x + _this.imgback.width &&
        y >= _this.imgback.y &&
        y <= _this.imgback.y + _this.imgback.height
      ) {
        cancelAnimationFrame(_this.requestId);
        this.RoleSelectScene = new RoleSelectScene(_this.ctx);
        return;
      } 
    });
  }
}
